@charset "utf-8";

.navbar{
    border-radius: 0;
}
.navbar-default{
    background-color: #222222;
    margin-bottom: 0;
    border: none;
}
/* 导航的a标签的默认样式和其他状态 黑底白字 */
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus{
    color: #fff;
    background-color: #080808;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{
    color: #f1f1f1;
}
.navbar-brand{
    padding-top: 7px;
}
.dropdown-menu{
    min-width: 135px;
    a{
        text-align: center;
    }
}

#flash{
    padding-top: 60px;
    padding-bottom: 60px;
    background-color: #8bc01f;
    color: white;
    .title{
        font-size: 48px;
        margin-bottom: 30px;
        span{
            display: inline-block;
            width: 55px;
            height: 53px;
            line-height: 53px;
            text-align: center;
            color: #8bc01f;
            background: white;
        }
    }
    .litle{
        margin-bottom: 55px;
        h2{
            font-size: 24px;
        }
    }
    .item{
        margin-bottom: 36px;
    }
    .down{
        width: 100px;
        height: 34px;
        line-height: 34px;
        font-size: 14px;
        text-align: center;
        background: white;
        border-radius: 5px;
        a{
            color: #8BC01F;
        }
    }
    .btn-img{
        text-align: center;
    }
}

#player{
    background-color: #3393df;
    color: white;
    padding-top: 60px;
    padding-bottom: 60px;
    .title{
        h1{
            p{
                font-size: 48px;
                span{
                    margin-right: 10px;
                    display: inline-block;
                    width: 42px;
                    height: 44px;
                    line-height: 44px;
                    text-align: center;
                    background-color: white;
                    font-size: 40px;
                    color: #3393df; 
                    border-radius: 5px;
                }
            }
        }
    }
    .merit{
        
        .merit-left{
            text-align: center;
            margin-top: 15px;
           
        }
        .merit-word{
            p{
                font-size: 14px;
                line-height: 43px;
                letter-spacing:3px;
            }
            .wordb{
                margin-top: 15px;
            }
        }
        .merit-right{
            text-align: center;
            img{
                margin-left: 25px;
            }
        }
    }
}

#stage{
    padding-top: 80px;
    padding-bottom: 80px;
    
    h1{
        font-size: 42px;
        color: #3393df;
        span{
            display: inline-block;
            width: 40px;
            height: 41px;
            line-height: 41px;
            text-align: center;
            font-size: 36px;
            background-color: #3393df;
            color: white;
            margin-right: 10px;
        }
    }
    .details{
        font-size: 18px;
        color: #5d5d5d;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .litle{
        font-size: 18px;
        color: #3393df;
    }
    p{
        color: #5d5d5d;
        font-size: 14px;
        margin-top: 15px;
        margin-bottom: 25px;
    }
    .mt19{
        margin-top: 19px;
    }
    .img-b{
        text-align: center;
        margin-bottom: 40px;
    }
}

footer{
    background: #3b3b3b;
    padding-top: 30px;
    padding-bottom: 30px;
    .w1000{
        margin: 0 auto;
    }
    .left-word{
        .word-top{
            margin-bottom: 10px;
            a{
                margin-right: 12px;
                color: #a1a3ab;
                font-size: 14px;
            }
        }
        .word-bottom{
            color: #a1a3ab;
            font-size: 12px;
        }
    }
    .right-img{
        margin-top: 5px;
        position: relative;
        a{
            margin-right: 20px;
            img{
                width: 38px;
                height: 38px;
                border-radius: 20px;
            }
        }
        .ewm{
            position: absolute;
            top: -160px;
            left: -36px;
            display: none;
            img{
                width: 100%;
                width: 142px;
                height: 150px;
                border-radius: 0;
            }
        }
        .col-sm-4:hover .ewm{
            display: block;
        }
    }
}


@media (min-width:992px){
    #player .merit-right{
        padding-top: 20%;
    }
}

@media (max-width:768px){
    #player .merit-word{
        box-sizing: border-box;
        padding-left: 5%;
        padding-right: 5%;
    }
}

@media (min-width:769px) and (max-width:991px){
    #stage{
        text-align: center;
    }
}

@media (min-width:1200px){
    .myNav{
        width: 1000px;
    }
    .w1000{
        width: 1000px;
    }
}